function myajax(url, data = {}, type = 'get') {
    return new Promise((resolve, reject) => {
        $.ajax({
            url,
            data,
            type,
            dataType: "json",
            success(res) {
                resolve(res)
            },
            error(e) {
                reject(e)
            }
        })
    })
}

function showCards(localUrl = '../json/15.json') {  //展示MV卡片
    // clearCards()
    myajax(`../json/${(localUrl)}.json`)
        .then(res => {
            // $(window).on("click", $('.ycmva'), function () {
            //     console.log(123456);
            // })
            // console.log(res.data.mv.list);
            res.data.mv.list.forEach((v, k) => {
                //↓挨个修改卡片里的内容
                ([...$('.ycmvli')][k]).innerHTML = (`<div class="ycmvbox">
                    <a href="./mvPlayer.html?${v.mv_name}&${v.v_id}&${v.singer_name}&${v.publish_date}" class="ycmva">
                        <img src="${v.mv_pic_url}" alt="" class="ycmvpic">
                        <div class="ycmvmask"></div>
                        <div class="ycmvicon"></div>
                    </a>
                    <h3 class="ycmvtitle">
                        <a href="https://y.qq.com/n/ryqq/mv/r00418t2eei">${v.mv_name}
                        </a>
                    </h3>
                    <p class="ycmvsinger">
                        <a href="https://y.qq.com/n/ryqq/singer/0045mZW01FjNgu" class="ycmvauthor">${v.singer_name}</a>
                    </p>
                    <div class="ycmvinfo">
                        <span class="ycmvlisten">
                            <div class="ycmvlistenicon" style="background-image: url(./ycpics/icons.png);">
                            </div>
                            ${transPlayCount(v.play_count)}
                        </span>
                    </div>
                </div>`)
            })
        })
}


function transPlayCount(x) {    //把过万的播放量转化为以万为单位、保留一位小数
    if (x < 10000) { return x }
    else { return (`${parseFloat(Math.floor(x / 1000)) / 10}万`) }
}

function showList(list, pointx) {   //展示MV标签、加载点击事件、并切换高亮
    showTitle(pointx)
    myajax('../json/mvCategory.json')
        .then(res => {
            switch (list) {
                case 0:
                    res.data.area.forEach((v, k) => {
                        if (v.id == pointx) { [...$('.yctab1')][k].classList.add('highlight') }
                        else { [...$('.yctab1')][k].classList.remove('highlight') }
                    });
                    [...$('.yctab1')][6].classList.add('highlight')
                    for (i = 7; i <= 13; i++) {
                        [...$('.yctab1')][i].classList.remove('highlight')
                    }
                    break;
                case 1:
                    res.data.version.forEach((v, k) => {
                        if (v.id == pointx) { [...$('.yctab1')][k + list * 6].classList.add('highlight') }
                        else { [...$('.yctab1')][k + 6].classList.remove('highlight') }
                    });
                    [...$('.yctab1')][0].classList.add('highlight')
                    for (i = 1; i <= 6; i++) {
                        [...$('.yctab1')][i].classList.remove('highlight')
                    }
                    break;
            }
        })
}

function showTitle(mvid) {  //改变MV卡片栏目的抬头
    switch (mvid) {
        case 15: $('#mvTitle').html(`全部MV`); break;
        case 16: $('#mvTitle').html(`内地`); break;
        case 17: $('#mvTitle').html(`港台`); break;
        case 18: $('#mvTitle').html(`欧美`); break;
        case 19: $('#mvTitle').html(`韩国`); break;
        case 20: $('#mvTitle').html(`日本`); break;
        case 7: $('#mvTitle').html(`全部类型`); break;
        case 8: $('#mvTitle').html(`MV`); break;
        case 9: $('#mvTitle').html(`现场`); break;
        case 10: $('#mvTitle').html(`翻唱`); break;
        case 11: $('#mvTitle').html(`舞蹈`); break;
        case 12: $('#mvTitle').html(`影视`); break;
        case 13: $('#mvTitle').html(`综艺`); break;
        case 14: $('#mvTitle').html(`儿歌`); break;
    }
}

//未来事件
// $(window).on("click", $('.box'), function (params) {
//     //方法体
// })